﻿@using KnockoutJS.Web.Extensions
@model KnockoutJS.Web.ViewModels.CartViewModel

<div id="cart-details">
    <button id="cart" type="button" class="btn btn-default btn-sm" data-toggle="modal" data-target="#myModal" data-bind="click:showCart">
        <span class="glyphicon glyphicon-shopping-cart" aria-hidden="true"></span>
        <span class="badge" data-bind="text:cart.cartItems().length;"></span>
    </button>

    <div id="cart-summary" style="display:none;">
        <span data-bind="visible:cart.cartItems().length == 0">当前购物车为空！</span>
        <div data-bind="visible:cart.cartItems().length > 0">
            <ol style="padding-left:15px;">
                <!--ko foreach :{data:cart.cartItems }-->
                <li data-bind="text:book.title"></li>
                <!--/ko-->
            </ol>
            <p><strong>总计:</strong>￥<span data-bind="text:cart.total()"></span></p>
        </div>
    </div>

    <script>
    var cartSummaryData = @Html.HtmlConvertToJson(Model);
    </script>
</div>